<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<!--bottom-nav-->
<nav class="mui-bar mui-bar-tab bottom-nav">
    <c:forEach items="${channelList}" var="value">
        <c:if test="${value.channel_type == 1}">
            <a class="mui-tab-item <c:if test="${pv=='info' and value.channel_short == channelShort}">mui-active</c:if>" href="<%=basePath%>app/page?pv=info&channelShort=${value.id}">
                <c:if test="${pv!='info' or value.id != channelShort}">
                    <span class="mui-icon <c:if test="${empty value.uncheck_channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.uncheck_channel_img_url}">style="background-image: url('${value.uncheck_channel_img_url}');"</c:if>></span>
                </c:if>
                <c:if test="${pv=='info' and value.id == channelShort}">
                    <span class="mui-icon <c:if test="${empty value.channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.channel_img_url}">style="background-image: url('${value.channel_img_url}');"</c:if>></span>
                </c:if>
                <span class="mui-tab-label">${value.channel_name}</span>
            </a>
        </c:if>
        <c:if test="${value.channel_type == 2}">
            <a class="mui-tab-item <c:if test="${pv=='comm' and value.channel_short == channelShort}">mui-active</c:if>" href="<%=basePath%>app/page?pv=comm&channelShort=${value.id}">
                <c:if test="${pv!='comm' or value.id != channelShort}">
                    <span class="mui-icon <c:if test="${empty value.uncheck_channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.uncheck_channel_img_url}">style="background-image: url('${value.uncheck_channel_img_url}');"</c:if>></span>
                </c:if>
                <c:if test="${pv=='comm' and value.id == channelShort}">
                    <span class="mui-icon <c:if test="${empty value.channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.channel_img_url}">style="background-image: url('${value.channel_img_url}');"</c:if>></span>
                </c:if>
                  <span class="mui-tab-label">${value.channel_name}</span>
            </a>
        </c:if>
        <c:if test="${value.channel_type == 3}">
            <a class="mui-tab-item <c:if test="${pv=='live' and value.channel_short == channelShort}">mui-active</c:if>" href="<%=basePath%>app/page?pv=live&channelShort=${value.id}">
                <c:if test="${pv!='live' or value.id != channelShort}">
                    <span class="mui-icon <c:if test="${empty value.uncheck_channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.uncheck_channel_img_url}">style="background-image: url('${value.uncheck_channel_img_url}');"</c:if>></span>
                </c:if>
                <c:if test="${pv=='live' and value.id == channelShort}">
                    <span class="mui-icon <c:if test="${empty value.channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.channel_img_url}">style="background-image: url('${value.channel_img_url}');"</c:if>></span>
                </c:if>
                <span class="mui-tab-label">${value.channel_name}</span>
            </a>
        </c:if>
        <c:if test="${value.channel_type == 5}">
            <a class="mui-tab-item <c:if test="${pv=='shop' and value.channel_short == channelShort}">mui-active</c:if>" href="<%=basePath%>app/page?pv=shop&channelShort=${value.id}">
                <c:if test="${pv!='shop' or value.id != channelShort}">
                    <span class="mui-icon <c:if test="${empty value.uncheck_channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.uncheck_channel_img_url}">style="background-image: url('${value.uncheck_channel_img_url}');"</c:if>></span>
                </c:if>
                <c:if test="${pv=='shop' and value.id == channelShort}">
                    <span class="mui-icon <c:if test="${empty value.channel_img_url}">mui-icon-02</c:if>" <c:if test="${not empty value.channel_img_url}">style="background-image: url('${value.channel_img_url}');"</c:if>></span>
                </c:if>
                <span class="mui-tab-label"> ${value.channel_name}</span>
            </a>
        </c:if>
    </c:forEach>
    <a class="mui-tab-item <c:if test="${pv=='mine'}">mui-active</c:if>" href="<%=basePath%>app/page?pv=mine">
        <span class="mui-icon mui-icon-05"></span>
        <span class="mui-tab-label">我的</span>
    </a>
</nav>